Copper.Task = function(config) {
    var startAngle = Copper.Util.timeToAngle(config.startTime);
    var endAngle = Copper.Util.timeToAngle(config.endTime);
    var container = config.renderTo;
    delete config.renderTo;
    
    var isCurrentTask = config.isSelected || Copper.TaskManager.isCurrentTask(config.id);
    var task = this;
    
    var mouseAngle;
    
    var editModeTimer;
    
    var mouseDown = function(e){
        Copper.TaskManager.selectedTaskId = this.taskId;
        mouseAngle = Copper.Util.getPointAngle(e.clientX + window.pageXOffset, e.clientY + window.pageYOffset);
        console.log('Task' + this.taskId + ' mouse down ................');
        //console.log('-----Start angle:' + (e.clientY + window.pageYOffset) + ':' + (e.clientX + window.pageXOffset));
        //console.log('-----Start angle:' + mouseAngle/Math.PI);
        Copper.TaskManager.setCurrentTask(this.taskId);
        

        
        task.container.draw();
        
        /*
        editModeTimer = setTimeout(function(){
            Copper.TaskForm.show();
            Copper.TaskForm.setValue({
                taskId: config.id,
                startTime: config.startTime,
                endTime: config.endTime,
                content: config.content,
                alarmBefore: config.alarmBefore
            });
        }, 700);
        */

        if(Copper.TaskManager.selectedTaskId == this.taskId){
            task.hide();
            Copper.DummyLayer.showTimeRegulator({
                startAngle: startAngle,
                endAngle: endAngle,
                taskId: task.id,
                startTime: task.startTime,
                endTime: task.endTime,
                content: task.content
            });
        }
        
        task._startMouseAngle = task._lastMouseAngle = task._mouseAngle = Copper.Util.getPointAngle(e.clientX + window.pageXOffset, e.clientY + window.pageYOffset);
        task._moveTimer = setInterval(function(){
            if(task._lastMouseAngle == task._mouseAngle){
                return;
            }
            
            var angle = task._mouseAngle - task._startMouseAngle;
            var newStartAngle = startAngle + angle;
            var newEndAngle = endAngle + angle;
    
            var newStartTime = Copper.Util.angleToTime(newStartAngle); 
            var newEndTime = Copper.Util.angleToTime(newEndAngle); 
            task._lastMouseAngle = task._mouseAngle;
        
            Copper.TaskManager.showDummyTask2({
                startTime: newStartTime,
                endTime: newEndTime,
                startAngle: newStartAngle,
                endAngle: newEndAngle,
                content: config.content
            });
            
        }, 13);
        
        if (task._fixTimer) {
            window.msCancelRequestAnimationFrame(task._fixTimer);
        }
        
        document.addEventListener('mousemove', mouseMove, false);
        document.addEventListener('mouseup', mouseUp, false);
        document.addEventListener('touchmove', mouseMove, false);
        document.addEventListener('touchend', mouseUp, false);
    };
    var mouseMove = function(e){  //console.log()
        task._mouseAngle = Copper.Util.getPointAngle(e.clientX + window.pageXOffset, e.clientY + window.pageYOffset);
        var angle = Copper.Util.getPointAngle(e.clientX + window.pageXOffset, e.clientY + window.pageYOffset) - mouseAngle;
        console.log('-----mouse at axis:' +  window.pageXOffset);
        console.log('-----mouse at degree:' + task._mouseAngle/Math.PI * 180);
        var newStartAngle = startAngle + angle;
        var newEndAngle = endAngle + angle;

        var newStartTime = Copper.Util.angleToTime(newStartAngle); 
        var newEndTime = Copper.Util.angleToTime(newEndAngle); 
         //console.log('-----TIME:' + newStartTime + ':' + newEndTime); 

        
    };
    var mouseUp = function(e){
        clearInterval(task._moveTimer);
        
        document.removeEventListener('mousemove', mouseMove);
        document.removeEventListener('mouseup', mouseUp);
        document.removeEventListener('touchmove', mouseMove);
        document.removeEventListener('touchend', mouseUp);
        
        var angle = Copper.Util.getPointAngle(e.clientX + window.pageXOffset, e.clientY + window.pageYOffset) - mouseAngle;
        var newStartAngle = startAngle + angle;
        var newEndAngle = endAngle + angle;
        var newStartTime = Copper.Util.angleToTime(newStartAngle); 
        var newEndTime = Copper.Util.angleToTime(newEndAngle); 
        
        
        var fixedTime = Copper.Util.fixTime(newStartTime, newEndTime);
        var fixedStartAngle = Copper.Util.timeToAngle(fixedTime[0]);
        var fixedEndAngle = Copper.Util.timeToAngle(fixedTime[1]);
        console.log('fixed time:' + fixedTime[0] + ':' + fixedTime[1]);
        console.log('fixed angle:' + newStartAngle + ':' + fixedStartAngle);
        //animation
        var animationStartTime = window.msAnimationStartTime;
        var step = fixedStartAngle - newStartAngle;

        var fn = function (timestamp) {
            var t = timestamp - animationStartTime;

            var s = step / 700 * t + newStartAngle;
            if ((s < fixedStartAngle && step > 0) || (s > fixedStartAngle && step < 0)) {
                Copper.TaskManager.showDummyTask2({
                    startTime: fixedTime[0],
                    endTime: fixedTime[1],
                    startAngle: s,
                    endAngle: step / 700 * t + newEndAngle,
                    content: config.content
                });
                task._fixTimer = window.msRequestAnimationFrame(fn);
            } else {
                Copper.TaskManager.showDummyTask2({
                    startTime: fixedTime[0],
                    endTime: fixedTime[1],
                    startAngle: fixedStartAngle,
                    endAngle: fixedEndAngle,
                    content: config.content
                });
                console.log('--------------------current'+Copper.TaskManager.selectedTaskId);
                Copper.TaskManager.hideDummyTask();
                Copper.TaskManager.updateTask({
                    id: Copper.TaskManager.selectedTaskId,
                    startTime: fixedTime[0],
                    endTime: fixedTime[1],
                    content: config.content
                });
            }

        };

        task._fixTimer = window.msRequestAnimationFrame(fn);
        
    };
    
    var taskRing = new Copper.TaskRing({ 
        startAngle: startAngle,
        taskId: config.id,
        endAngle: endAngle,
        fillStyle: (isCurrentTask? 'white': 'rgba(0,0,0,0.1)'),
        isSelected: isCurrentTask 
    });
    taskRing.on('mousedown', mouseDown);
    taskRing.on('touchstart', mouseDown);
    container.add(taskRing);
    this.taskRing = taskRing;
    
    var taskBubble = new Copper.TaskBubble({
        taskId: config.id,
        startAngle: startAngle,
        endAngle: endAngle,
        title: config.startTime + ' ~ ' + config.endTime,
        content: config.content,
        isSelected: isCurrentTask                   
    
    });
    taskBubble.on('mousedown', mouseDown);
    taskBubble.on('touchstart', mouseDown);
    
    container.add(taskBubble);
    this.taskBubble = taskBubble;
    
    this.container = container;
    this.taskId = config.id;
    this.id = config.id;
    this.dragging = false;
    this.startTime = config.startTime;
    this.endTime = config.endTime;
    this.content = config.content;
    
    if(this.buttonShowed){
        var bubbleCenter = taskBubble.getCenter();
        var currentTaskRadius = Copper.Global.currentTaskRadius;
        var deleteX, deleteY, editX, editY;
        if(bubbleCenter[0] >= Copper.Global.centerX){
            deleteX = editX = bubbleCenter[0] + Math.cos(Math.PI / 18) * currentTaskRadius;          
        } else {
            deleteX = editX = bubbleCenter[0] - Math.cos(Math.PI / 18) * currentTaskRadius;
        }
        deleteY = bubbleCenter[1] - Math.sin(Math.PI / 16) * currentTaskRadius;
        editY = bubbleCenter[1] + Math.sin(Math.PI / 16) * currentTaskRadius;
        var editButton = new Kinetic.Shape({
            x: editX,
            y: editY,
            radius: 20, 
            fill: 'rgba(255,0,0,1)',
            cursor:'pointer',
            drawFunc: function() {
                var canvas = this.getCanvas();
                var context = this.getContext();
                context.beginPath();
                context.arc(0, 0, this.radius, 0, Math.PI * 2, true);
                context.fillStyle = this.fill;
                context.fill();
                context.font = "28px Segoe UI Light";        
                context.fillStyle = 'rgb(255,255,255)';
                context.fillText('E',-8, 10);
                context.closePath();
            }
        });
        editButton.on('mouseover', function(){
            this.setFill('rgba(255,0,0,0.8)');
            container.draw();
        });
        editButton.on('mouseout', function(){
            this.setFill('rgba(255,0,0,1)');
            container.draw();
        });
        container.add(editButton);
        
        var deleteButton = new Kinetic.Shape({
            x: deleteX,
            y: deleteY,
            radius: 20, 
            fill: 'rgba(255,0,0,1)',
            cursor:'pointer',
            drawFunc: function() {
                var canvas = this.getCanvas();
                var context = this.getContext();
                context.beginPath();
                context.arc(0, 0, this.radius, 0, Math.PI * 2, true);
                context.fillStyle = this.fill;
                context.fill();
                context.font = "28px Segoe UI Light";        
                context.fillStyle = 'rgb(255,255,255)';
                context.fillText('X',-8, 10);
                context.closePath();
            }
        });
        deleteButton.on('mouseover', function(){
            this.setFill('rgba(255,0,0,0.8)');
            container.draw();
        });
        deleteButton.on('mouseout', function(){
            this.setFill('rgba(255,0,0,1)');
            container.draw();
        });
        container.add(deleteButton);
    }
};

Copper.Task.prototype = {

    select: function(){
        var fillStyle = 'white';
        this.taskRing.toggle();
        this.taskBubble.toggle();
        this.taskRing.moveToTop();
        this.taskBubble.moveToTop();
    },
    
    unselect: function(){
        var fillStyle = 'rgba(0,0,0,0.1)';
        this.taskRing.toggle();
        this.taskBubble.toggle();
    },
    
    getJson: function(){
        return {
            id: this.id,
            startTime: this.startTime,
            endTime: this.endTime,
            content: this.content,
            alarmBefore: this.alarmBefore
        };
    },
    
    showButton: function(toShow){
        this.buttonShowed = toShow;
    },
    
    hide: function(){
        this.taskRing.hide();
        this.taskBubble.hide();
    },
    
    show: function(){
        this.taskRing.show();
        this.taskBubble.show();
    },
    
    refresh: function(){
        
    }
};